<template>
	<view class="content fofa poRel">
		<tabnav title="收藏模板" :col="back"></tabnav>
		<view style="height: 40rpx;"></view>
		<view class="wid90 mar box1 bacFFF borRad10 dis disAl" style="height: 117rpx;">
			<view class="wid90 mar dis disAl foSi30">
				<view style="color: #9A9999;">模板标题</view>
				<view class="mar-left30">{{pdfurl.templateName}}</view>
			</view>
		</view>
		<view class="mar-top30 bacFFF borRad10 wid90 mar box1">
			<view style="height: 20rpx;"></view>
			<view class="wid90 mar">
				<view v-for="(item,index) in pdfurl.recipients" :key="index" class="hei80 dis disAl">
					<view v-if="item.recipientType == 'ENTERPRISE'" class="dis disAl disJuC borRad10 mar-right30 coFFF foSi25" style="width: 71rpx;height: 51rpx;" 
						:style="'background-color: '+back+';'">企业</view>
					<view v-if="item.recipientType == 'INDIVIDUAL'" class="dis disAl disJuC borRad10 mar-right30 coFFF foSi25" style="width: 71rpx;height: 51rpx;"
						:style="'background-color: '+back+';'">个人</view>
					<view class="foSi30">{{item.roleName}}</view>
				</view>
				<view class="foSi25 mar-top20" style="color: #B5B4B4;">使用该模板时填写对方信息</view>
			</view>
			<view style="height: 20rpx;"></view>
		</view>
		<view class="wid100 dis disAl disJuC poAbs bacFFF box1" :style="{'padding-bottom': paddingBottomHeight + 'rpx'}" style="height: 120rpx;bottom: 0;">
			<view class="dis disAl disJuC coFFF hei80 foSi35 borRad10"
			:style="'background-color: '+back+';'" style="width: 500rpx;">确认收藏到企业自有模板</view>
		</view>
	</view>
</template>

<script>
	import tabnav from "../common/tabnav/tabnav.vue"
	export default {
		components: {
			tabnav,
		},
		data() {
			return {
				paddingBottomHeight: 0,
				back: uni.getStorageSync('back'),
				pdfurl: ''
			}
		},
		onLoad(option) {
			this.pdfurl = uni.getStorageSync('contract_detail')
		},
		created() {
			var that = this
			uni.getSystemInfo({
				success: (e) => {
					console.log(e)
					that.tops = e.statusBarHeight
					let model = ['X', 'XR', 'XS', '11', '12', '13', '14', '15'];
					model.forEach(item => {
						//适配iphoneX以上的底部，给tabbar一定高度的padding-bottom
						if(e.model.indexOf(item) != -1 && e.model.indexOf('iPhone') != -1) {
							that.paddingBottomHeight = 40;
						}
					})
				}
			})
		},
		methods: {
			tiaozhuan(url){
				uni.navigateTo({
					url: url
				});
			},
		}
	}
</script>

<style>
	.content {
		min-height: 100vh;
		background-color: #F4F3F3;
	}
</style>
